<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">
		<style type="text/css">
.displayImageDivStyle {
	width: 102px;
	height: 102px;
	border: solid 1px #D4D4D4;
	margin: 0px auto 10px auto;
}

body{
	text-align: center;
}

.formStyle {
	text-align: left;
}
</style>
	</head>
	<script type="text/javascript">
function displayHeadImage() {

	if (navigator.userAgent.indexOf("MSIE 6.0") >= 1) {
		var picsrc = document.getElementById("uploadHeadImage").value;
		var content = "<img src='" + picsrc + "'style=width='102px'; height='102px'/>";
		document.getElementById("displayHeadImageDiv").innerHTML = content;
	} else if (navigator.userAgent.indexOf("MSIE 7.0") >= 1) {
		var displayHeadImageDiv = document.getElementById("displayHeadImageDiv");
		displayHeadImageDiv.filters
				.item("DXImageTransform.Microsoft.AlphaImageLoader").src = document
				.getElementById('uploadHeadImage').value;
		displayHeadImageDiv.filters
				.item("DXImageTransform.Microsoft.AlphaImageLoader").style.width="102px";
		displayHeadImageDiv.filters
				.item("DXImageTransform.Microsoft.AlphaImageLoader").style.height="102px";
	}

	else if (window.navigator.userAgent.indexOf("MSIE 8.0") >= 1) {
		var picsrc = document.getElementById('uploadHeadImage');
		fileImgpath.select();
		var fileinfo = document.selection.createRange().text;
		var displayHeadImageDiv = document.getElementById("displayImageDiv");
		displayHeadImageDiv.filters
				.item("DXImageTransform.Microsoft.AlphaImageLoader").src = fileinfo;
		displayHeadImageDiv.filters
				.item("DXImageTransform.Microsoft.AlphaImageLoader").style.width="102px";
		displayHeadImageDiv.filters
				.item("DXImageTransform.Microsoft.AlphaImageLoader").style.height="102px";
	}

	else if (navigator.userAgent.indexOf("Firefox") > 0) {
		var picsrc = document.getElementById('uploadHeadImage').files.item(0)
				.getAsDataURL();
		var content = "<img src='" + picsrc + "'style=width='102px'; height='102px'/>";
		document.getElementById('displayHeadImageDiv').innerHTML = content;
	}
}

function userChoose() {
	if (document.getElementById("chooseRadio1").checked == true) {
		document.getElementById("new").style.display = "inline";
		document.getElementById("Exist").style.display = "none";
	} else if (document.getElementById("chooseRadio2").checked == true) {
		document.getElementById("new").style.display = "none";
		document.getElementById("Exist").style.display = "inline";
	}
}

function modifyHeadImage(obj) {
	parent.document.getElementById("headImage").src =obj.src;
	document.getElementById("imageName").value=obj.src.substring(35);
}
</script>

	<body>
		<div style="width: 193px;">
			<div style="191px;">
				<input type="radio" name="choose" id="chooseRadio2" value="Exist"
					onclick="userChoose()" style="margin: 0px;" checked="checked" />已存相册
				<input type="radio" name="choose" id="chooseRadio1" value="new"
					onclick="userChoose()" style="margin: 0px;" />上传
			</div>
			<div id="new" style="width:191px; display: none;">
				<span>头像预览：</span>
				<div class="displayImageDivStyle" id="displayHeadImageDiv">
				</div>
				<form action="uploadImageAction" class="formStyle" method="post"
					enctype="multipart/form-data">
					<span>请选择图片：</span>
					<input name="uploadFile" id="uploadHeadImage" type="file" size="8"
						onchange="displayHeadImage()" />
					<input type="text" name="albumOkly" value="album_old"
						readonly="readonly" style="display: none;">
					<input type="text" name="uploadDesign" value="uploadHeadImage"
						readonly="readonly" style="display: none;">
					<input type="submit" value="上传" />
				</form>
			</div>
			<div id="Exist" style="width:191px;">
					<s:iterator value="images">
						<a href="#" onclick="return false;"><img src="files/<s:property value='albumImageName' />" style="width: 102; height: 102" onclick="modifyHeadImage(this)" /></a>
					</s:iterator>
					<form action="modifyUserAction_modifyUserHeadImageExist">
						<input type="text" value="" id="imageName" name="imageName" style="display:none"/>
						<input type="submit" value="提交" />
					</form>
			</div>
		</div>
	</body>
</html>
